<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <title>resume</title>
    <link rel="stylesheet" type="text/css" href="./css/index-974d00b9cc.css">
    <link rel="stylesheet" href="./resources/font/iconfont.css">
</head>
<body>
    <!--刚进去时的动画-->
    <div id="slide">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <img src="./images/animation/house.jpeg" alt="" class="ani resize" style="position: absolute; top:70px;left:90px;width:80px;transform:rotate(49deg);" swiper-animate-effect="swing" swiper-animate-duration="3.5s" swiper-animate-delay="0.5s"> 
                    <p class="ani resize" style="font-size: 40px; color:beige;position: absolute; top: 300px;left: 150px;" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay='0.5s'>曹瑾 简介</p>
                    <img src="./images/animation/air.png" alt="" class="ani resize" style="position: absolute; left:150px;top: 450px;width: 100px;" swiper-animate-effect="rollIn" swiper-animate-duration="1s" swiper-animate-delay='1s'>
                </div>

                <div class="swiper-slide">
                    <p class="ani resize" style="font-size: 25px; color:beige;position: absolute; top: 60px;left: 50px;" swiper-animate-effect="wobble" swiper-animate-duration="1s" swiper-animate-delay='0.5s'>看我拿手的：</p>
                    <img src="./images/animation/js.png" alt="" class="ani resize" style="position: absolute; top:150px;left:50px;width:60px;" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/html.png" alt="" class="ani resize" style="position: absolute; top:150px;left:130px;width:60px;" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/CSS.png" alt="" class="ani resize" style="position: absolute; top:150px;left:200px;width:60px;" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/jquery.png" alt="" class="ani resize" style="position: absolute; top:150px;left:270px;width:60px;" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/sass.png" alt="" class="ani resize" style="position: absolute; top:300px;left:50px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeftBig" swiper-animate-duration="1s" swiper-animate-delay="0.5s">      
                    <img src="./images/animation/MVC.png" alt="" class="ani resize" style="position: absolute; top:300px;left:130px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeftBig" swiper-animate-duration="1s" swiper-animate-delay="0.5s">            
                    <img src="./images/animation/gulp.png" alt="" class="ani resize" style="position: absolute; top:300px;left:200px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeftBig" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/angularjs.png" alt="" class="ani resize" style="position: absolute; top:300px;left:270px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeftBig" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/react.png" alt="" class="ani resize" style="position: absolute; top:450px;left:50px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeftBig" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/vue.png" alt="" class="ani resize" style="position: absolute; top:450px;left:130px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeftBig" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/bootstrap.png" alt="" class="ani resize" style="position: absolute; top:450px;left:200px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeftBig" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                </div>
                <div class="swiper-slide">
                    <p class="ani resize" style="font-size: 25px; color:beige;position: absolute; top: 60px;left: 20px;" swiper-animate-effect="wobble" swiper-animate-duration="1s" swiper-animate-delay='0.5s'>我还会后端与数据库技术：</p>                
                    <img src="./images/animation/PHP.png" alt="" class="ani resize" style="position: absolute; top:200px;left:50px;width:60px;" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/nodejs.png" alt="" class="ani resize" style="position: absolute; top:200px;left:130px;width:60px;" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="0.5s"> 
                    <img src="./images/animation/mySql .png" alt="" class="ani resize" style="position: absolute; top:200px;left:200px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="0.5s">
                    <img src="./images/animation/mongoDb.png" alt="" class="ani resize" style="position: absolute; top:200px;left:270px;width:60px;transform:rotate(49deg);" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="0.5s">
                    <div  class="ani resize" style="position: absolute; top:350px;left:85px;width:200px;line-height:30px;" swiper-animate-effect="wobble" swiper-animate-duration="1s" swiper-animate-delay="0.5s">
                        <p style="color:#fff;font-size:14px">拥有多年的项目经验，完成上千万金额项目数个。</p>
                        <p style="color:#fff;font-size:14px">发表技术博客数百篇。</p>
                        <p style="color:#fff;font-size:14px">对nodejs技术深有研究。</p>
                    </div>              
                    <button type="button" id="enter" class="ani resize" style="position: absolute;bottom: 25px;left:135px;" swiper-animate-effect="fadeInUp" swiper-animate-duration="1.5s" swiper-animate-delay="1s">查看详情</button>
                </div>
            </div>
            <img src="./images/animation/web-swipe-tip.png" style="width:20px;height:15px; bottom: 10px; left:175px;" id="array" class="resize"> 
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
        </div>
    </div>
   

    <!-- 主体内容-->
    <div id="mainContainer">
        <div id="header">
            <button id="location">定位</button>

            <p>caojin</p>   

            <button id="scan">扫一扫</button>
        </div>
        <div id="m">
            <div id="wrapper">
                <div id="scroller">	
                    <ul>
                        <li class="head">
                            <div class="img">
                                <img src="./images/about.jpg" alt="" style="width:80px">
                            </div>
                            <ul class="basic">
                                <li>姓名： 曹瑾</li>
                                <li>性别： 男</li>
                                <li>年龄： 25</li>
                                <li>学历： 本科</li>
                            </ul>
                        </li>
                        <li class="school">
                            <div class="img">
                                <img src="./images/school.jpg" alt="" style="width:50px">
                            </div>
                                <p class="tit">教育经历：</p>
                                <p class="tet">嘉兴学院南湖学院</p>
                        </li>
                        <li class="go">
                            <div class="img">
                                <img src="./images/work.png" alt="" style="width:50px">
                            </div>
                            <p class="tit">工作实习：</p>
                            <p class="tet">网易（2014~2016）</p>
                        </li>
                        <li class="power">
                            <div class="img">
                                <img src="./images/power.png" alt="" style="width:50px">
                            </div>
                            <p class="tit">拿的出手的：</p>
                            <ul class="skill">
                                <li>html</li>
                                <li>css</li>
                                <li>js</li>
                                <li>node.js</li>
                                <li>具体见技术模块</li>
                            </ul>
                        </li>
                        <li class="project">
                            <div class="img">
                                <img src="./images/project.png" alt="" style="width:50px">
                            </div>
                            <p class="tit">做过的项目：</p>
                            <ul class="item">
                                <li>国美</li>
                                <li>豆瓣</li>
                                <li>知乎</li>
                                <li>具体见项目模块</li>
                            </ul>
                        </li>
                        <li class="like">
                            <div class="img">
                                <img src="./images/like.png" alt="" style="width:50px">
                            </div>
                            <p class="tit">兴趣爱好：</p>
                            <p class="tet">码代码，爬山</p>
                        </li>
                        <li class="self">

                            自我评价：
                        </li>
                        <li class="evaluate">
                                忠实诚信,讲原则，说到做到，决不推卸责任；有自制力，做事情始终坚持有始有终，从不半途而废；肯学习,有问题不逃避,愿意虚心向他人学习；自信但不自负,不以自我为中心；愿意以谦虚态度赞扬接纳优越者,权威者；会用100%的热情和精力投入到工作中；平易近人。为人诚恳,性格开朗,积极进取,适应力强、勤奋好学、脚踏实地，有较强的团队精神,工作积极进取,态度认真。
                        </li>
                        <li class="iu">
                            <img src="./images/iu.jpg" alt="" style="width: 200px">
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div id="t">
            <div id="wrapper">
                <div id="scroller">	
                    <ul class="box">
                        
                    </ul>
                </div>
            </div>
        </div>
        <div id="w">
            <div id="wrapper">
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                    
                    
                    </div>
                </div>
            </div>
        </div>
        <div id="footer">
            <ul class="icon_lists">
                <li class="me">
                    <i class="icon iconfont icon-me active"></i>
                    <div class="name active">我</div>
                </li>
                <li class="work">
                    <i class="icon iconfont icon-gongzuojingli"></i>
                    <div class="name">工作经历</div>
                </li>
                <li class="skill">
                    <i class="icon iconfont icon-jineng1"></i>
                    <div class="name">技能掌握</div>
                </li>
                <li class="project">
                    <i class="icon iconfont icon-project"></i>
                    <div class="name">项目经历</div>
                </li>
            </ul>
        </div>
    </div>
    <script src="./js/index-aac8b066ba.js"></script>
</body>
</html>